<template>
  <div>
    <!-- 基本信息 -->
    <div class="baseInfoRight">
      <h4 class="withVerticleLineT4 title14">{{ $t('basicInformation') }}</h4>
      <div class="baseInfoItems">
        <a-row class="baseInfoItem" v-if="taskInfor.taskGcyExt">
          <a-col :md="10" :sm="14">{{ $t('紧急OTA表单编号') }}</a-col>
          <a-col :md="14" :sm="10" class="result">
            <table-ellipsis :text="taskInfor.taskGcyExt.gcySerialNo || '-'"></table-ellipsis>
          </a-col>
        </a-row>
        <a-row class="baseInfoItem">
          <a-col :md="10" :sm="14">{{ $t('campaignName') }}</a-col>
          <a-col :md="14" :sm="10" class="result">
            <table-ellipsis :text="taskInfor.name || '-'"></table-ellipsis>
          </a-col>
        </a-row>
        <a-row class="baseInfoItem" v-if="taskInfor.taskGcyExt">
          <a-col :md="10" :sm="14">{{ $t('批次名称') }}</a-col>
          <a-col :md="14" :sm="10" class="result">
            <table-ellipsis :text="taskInfor.taskGcyExt.batchName || '-'"></table-ellipsis>
          </a-col>
        </a-row>
        <a-row class="baseInfoItem">
          <a-col :md="10" :sm="14">{{ $t('批次号') }}</a-col>
          <a-col :md="14" :sm="10" class="result">
            <table-ellipsis :text="taskInfor.batchNo || '-'"></table-ellipsis>
          </a-col>
        </a-row>
        <a-row class="baseInfoItem" v-if="taskInfor.taskGcyExt">
          <a-col :md="10" :sm="14">{{ $t('申请人') }}</a-col>
          <a-col :md="14" :sm="10" class="result">
            <table-ellipsis :text="taskInfor.taskGcyExt.applyUserId || '-'"></table-ellipsis>
          </a-col>
        </a-row>
        <!-- 升级类型 -->
        <a-row class="baseInfoItem">
          <!-- lxhmodifyxccode -->
          <a-col :md="10" :sm="14">{{ $t('upgradeType') }}</a-col>
          <a-col :md="14" :sm="10" class="result">
            <table-ellipsis :text="taskTypeObj[taskInfor.type]"></table-ellipsis>
          </a-col>
        </a-row>
        <!-- 是否强制升级 -->
        <a-row class="baseInfoItem" v-if="taskInfor.type == '1'">
          <a-col :md="10" :sm="14">{{ $t('isQzsj') }}</a-col>
          <a-col :md="14" :sm="10" class="result">
            <table-ellipsis

              :text="forceUpgradeTypeObj[taskInfor.forceUpgrade]"
            ></table-ellipsis>
          </a-col>
        </a-row>
        <!-- 是否静默升级 -->
        <a-row class="baseInfoItem" v-else>
          <a-col :md="10" :sm="14">{{ $t('sfjmsj') }}</a-col>
          <a-col :md="14" :sm="10" class="result">
            <table-ellipsis
              :text="slienceUpgradeTypeObj[taskInfor.silenceUpgrade]"
            ></table-ellipsis>
          </a-col>
        </a-row>
        <!-- OTA升级范围 -->
        <a-row class="baseInfoItem" v-if="taskInfor.taskGcyExt && upgradeTriggerType!=='warehouse'">
          <a-col :md="10" :sm="14">{{ $t('OTA升级范围') }}</a-col>
          <a-col :md="14" :sm="10" class="result">
<!--            TODO 多个 字典 转换-->
            <table-ellipsis
              :text="TaskUtil.transUpdateScope(taskInfor.taskGcyExt.updateScope)"
            ></table-ellipsis>
          </a-col>
        </a-row>
        <!-- 备案号 -->
        <a-row class="baseInfoItem">
          <a-col :md="10" :sm="14">{{ $t('备案流程编号') }}</a-col>
          <a-col :md="14" :sm="10" class="result">
            <table-ellipsis :text="taskInfor.recordNo || '-'"></table-ellipsis>
          </a-col>
        </a-row>
        <!-- 备注 -->
        <a-row class="baseInfoItem">
          <a-col :md="10" :sm="14">{{ `${$t('升级原因')}` }}</a-col>
          <a-col :md="14" :sm="10" class="result">
            <table-ellipsis :text="taskInfor.remark || '-'"></table-ellipsis>
          </a-col>
        </a-row>
        <!-- 生效时间 -->
        <a-row class="baseInfoItem">
          <a-col :md="10" :sm="14">{{ $t('effectiveTime') }}</a-col>
          <a-col :md="14" :sm="10" class="result">
            <table-ellipsis
              v-if="taskInfor.startTime || taskInfor.startTimeStr"
              :text="$options.filters.moment(taskId ? taskInfor.startTime : taskInfor.startTimeStr, 'YYYY-MM-DD HH:mm')"
            ></table-ellipsis>
            <span v-else>-</span>
          </a-col>
        </a-row>
        <!-- 失效时间 -->
        <a-row class="baseInfoItem">
          <a-col :md="10" :sm="14">{{ $t('failureTime') }}</a-col>
          <a-col :md="14" :sm="10" class="result">
            <table-ellipsis
              v-if="taskInfor.endTime || taskInfor.endTimeStr"
              :text="$options.filters.moment(taskId ? taskInfor.endTime : taskInfor.endTimeStr, 'YYYY-MM-DD HH:mm')"
            ></table-ellipsis>
            <span v-else>-</span>
          </a-col>
        </a-row>
        <!-- 任务状态 -->
        <a-row class="baseInfoItem" v-if="taskId">
          <a-col :md="10" :sm="14">{{ $t('campaignStatus') }}</a-col>
          <a-col :md="14" :sm="10" class="result">
            <icon-with-dropdown :record="taskInfor" @action="handleClickDropdownMenu"></icon-with-dropdown>
            <span style="margin-left: 26px">{{ taskUpdateObjText[taskInfor.status] }}</span>
          </a-col>
        </a-row>
        <!-- 升级策略 -->
        <a-row class="baseInfoItem">
          <a-col :md="10" :sm="14">{{ $t('sjcl') }}</a-col>
          <a-col :md="14" :sm="10" class="result">
            <a @click="showCelue">
              <table-ellipsis :text="taskInfor.strategyName"></table-ellipsis>
            </a>
          </a-col>
        </a-row>
        <!-- 唤醒通道 -->
        <a-row v-if="taskInfor.type == '2'" class="baseInfoItem">
          <a-col :md="10" :sm="14">{{ $t('hxtd') }}</a-col>
          <a-col :md="14" :sm="10" class="result">
            <table-ellipsis

              :text="factoryChannelObj[taskInfor.factoryChannel] || '-'"
            ></table-ellipsis>
          </a-col>
        </a-row>
        <!-- 创建时间 -->
        <a-row class="baseInfoItem" v-if="taskId">
          <a-col :md="10" :sm="14">{{ $t('timeOfCreation') }}</a-col>
          <a-col :md="14" :sm="10" class="result">
            <table-ellipsis

              :text="$options.filters.moment(taskInfor.createTime)"
            ></table-ellipsis>
          </a-col>
        </a-row>
        <!-- 创建人 -->
        <a-row class="baseInfoItem" v-if="taskId">
          <a-col :md="10" :sm="14">{{ $t('creator') }}</a-col>
          <a-col :md="14" :sm="10" class="result">
            <table-ellipsis :text="taskInfor.createBy"></table-ellipsis>
          </a-col>
        </a-row>
        <!-- 提交报告是否完整 -->
        <a-row class="baseInfoItem" v-if="taskInfor.taskGcyExt">
          <a-col :md="10" :sm="14">{{ $t('提交报告是否完整') }}</a-col>
          <a-col :md="14" :sm="10" class="result">
            <taskGcyUploadInfo :task-gcy-ext="taskInfor.taskGcyExt" :task-name="taskInfor.name"/>
          </a-col>
        </a-row>
        <!-- 供应商验证结论 -->
        <a-row class="baseInfoItem" v-if="taskInfor.taskGcyExt">
          <a-col :md="10" :sm="14">{{ $t('供应商验证结论') }}</a-col>
          <a-col :md="14" :sm="10" class="result">
            <table-ellipsis
              :text="$store.getters.getDictCodeObj('gcyOtaSupplierVerifyResultDictCode')[taskInfor.taskGcyExt.supplierVerifyConclusion]"
            ></table-ellipsis>
          </a-col>
        </a-row>
        <!-- 产品验证结论 -->
        <a-row class="baseInfoItem" v-if="taskInfor.taskGcyExt">
          <a-col :md="10" :sm="14">{{ $t('产品验证结论') }}</a-col>
          <a-col :md="14" :sm="10" class="result">
            <table-ellipsis
              :text="$store.getters.getDictCodeObj('gcyOtaSupplierVerifyResultDictCode')[taskInfor.taskGcyExt.productVerifyConclusion]"
            ></table-ellipsis>
          </a-col>
        </a-row>
      </div>
    </div>
    <!-- 统计信息 -->
    <div class="taskBaseInfo baseInfoRight" v-if="taskId">
      <h4 class="withVerticleLineT4 title14">{{ $t('tjxx') }}</h4>
      <div class="baseInfoItems">
        <!-- 全部车辆 -->
        <a-row class="baseInfoItem">
          <a-col :md="10" :sm="14">{{ `${$t('allVehicles')}(${$t('tai')})` }}</a-col>
          <a-col :md="14" :sm="10" class="result">
            <table-ellipsis

              class="static"
              :text="infoStaticData.totalVehicle"
            ></table-ellipsis>
          </a-col>
        </a-row>
        <!-- 成功车辆 -->
        <a-row class="baseInfoItem">
          <a-col :md="10" :sm="14">{{ `${$t('successfulVehicle')}(${$t('tai')})` }}</a-col>
          <a-col :md="14" :sm="10" class="result">
            <table-ellipsis

              class="static"
              :text="infoStaticData.successVehicle"
            ></table-ellipsis>
          </a-col>
        </a-row>
        <!-- 失败车辆 -->
        <a-row class="baseInfoItem">
          <a-col :md="10" :sm="14">{{ `${$t('failedVehicle')}(${$t('tai')})` }}</a-col>
          <a-col :md="14" :sm="10" class="result">
            <table-ellipsis

              class="static"
              :text="infoStaticData.failVehicle"
            ></table-ellipsis>
          </a-col>
        </a-row>
        <!-- 进行中车辆 -->
        <a-row class="baseInfoItem" v-if="taskId">
          <a-col :md="10" :sm="14">{{ `${$t('vehicleInProgress')}(${$t('tai')})` }}</a-col>
          <a-col :md="14" :sm="10" class="result">
            <table-ellipsis

              class="static"
              :text="infoStaticData.runningVehicle"
            ></table-ellipsis>
          </a-col>
        </a-row>
        <!-- 未开始车辆 -->
        <a-row class="baseInfoItem">
          <a-col :md="10" :sm="14">{{ `${$t('vehicleNotStarted')}(${$t('tai')})` }}</a-col>
          <a-col :md="14" :sm="10" class="result">
            <table-ellipsis

              class="static"
              :text="infoStaticData.notStartVehicle"
            ></table-ellipsis>
          </a-col>
        </a-row>
        <!-- 已暂停车辆 -->
        <a-row class="baseInfoItem">
          <a-col :md="10" :sm="14">{{ `${$t('suspendedVehicle')}(${$t('tai')})` }}</a-col>
          <a-col :md="14" :sm="10" class="result">
            <table-ellipsis

              class="static"
              :text="infoStaticData.pausedVehicle"
            ></table-ellipsis>
          </a-col>
        </a-row>
        <!-- 未完成车辆 -->
        <a-row class="baseInfoItem">
          <a-col :md="10" :sm="14">{{ `${$t('unfinishedVehicle')}(${$t('tai')})` }}</a-col>
          <a-col :md="14" :sm="10" class="result">
            <table-ellipsis

              class="static"
              :text="infoStaticData.notCompleteVehicle"
            ></table-ellipsis>
          </a-col>
        </a-row>
      </div>
    </div>
    <!--任务设置  -->
    <div class="taskBaseInfo baseInfoRight" v-if="taskId">
      <h4 class="withVerticleLineT4 title14">{{ $t('taskSetting') }}</h4>
      <!-- 任务审核 -->
      <a-row class="baseInfoItem">
        <a-col :md="10" :sm="14">{{ $t('campaignAudit') }}</a-col>
        <a-col :md="14" :sm="10" class="result">
          <a @click="viewyAuditProcess">{{ $t('view') }}</a>
        </a-col>
      </a-row>
      <!-- 灰度发布 用户升级且开启灰度发布-->
      <a-row v-if="taskInfor.type == '1'&&taskInfor.grayPush===1" class="baseInfoItem">
        <a-col :md="10" :sm="14">{{ $t('greyRelease') }}</a-col>
        <a-col :md="14" :sm="10" class="result">
          <a @click="openVerifyDetailModel('ViewGreyRelease')">{{ $t('view') }}</a>
        </a-col>
      </a-row>
    </div>
    <!-- 查看策略 -->
    <show-condition-update-strategy
      ref="showStrategy"
      :updataStrategyId="taskInfor.strategyId"
      :taskId="taskId"
    ></show-condition-update-strategy>
    <!-- 查看审核结果和灰度发布 -->
    <a-modal
      v-model="verifyDetailVisible"
      :title="compName==='LookupVerifyDetail'?$t('auditInformation'):$t('greyRelease')"
      width="1000px"
      dialogClass="createFormStyle"
      :bodyStyle="{ height: '500px', overflowY: 'auto' }"
    >
      <template slot="footer">
        <a-button @click="verifyDetailVisible = false" type="primary">{{ $t('back') }}</a-button>
      </template>
      <component :is="compName" :items="AuditGreyItems" operationResultName="status"></component>
    </a-modal>
    <audit-process-dialog ref="auditProcessDialogRef" :title="$t('auditProcess')" :query="auditProcessQuery" v-if="channel == 1">
    </audit-process-dialog>
    <TaskAuditHistory ref="auditProcessDialogRef" :task-id="taskId" :query="auditProcessQuery" v-else>
    </TaskAuditHistory>
  </div>
</template>
<script>
import { mapState } from 'vuex'
import ShowConditionUpdateStrategy from '@/views/components/ShowConditionUpdateStrategy'
import LookupVerifyDetail from '@/views/components/AuditProcess/displayTbList.vue'
import TableEllipsis from '@/components/Ellipsis/TableEllipsis'
import ViewGreyRelease from '@/views/components/ViewGreyRelease'
import IconWithDropdown from '@/views/components/IconWithDropdown'
import AuditProcessDialog from '@/views/components/AuditFlowProcess/dialog.vue'
import TaskAuditHistory from '@/views/task/components/taskAuditHistory'
import taskGcyUploadInfo from './taskGcyUploadInfo.vue'
import TaskUtil from '@views/task/taskUtil'
const initInfoData = {
  totalVehicle: '-',
  successVehicle: '-',
  notStartVehicle: '-',
  notCompleteVehicle: '-',
  failVehicle: '-',
  runningVehicle: '-',
  pausedVehicle: '-'
}
export default {
  components: {
    ShowConditionUpdateStrategy,
    LookupVerifyDetail,
    TableEllipsis,
    IconWithDropdown,
    ViewGreyRelease,
    taskGcyUploadInfo,
    TaskAuditHistory,
    AuditProcessDialog
  },
  name: 'DetailTaskBaseInfor',
  computed: {
    ...mapState({
      // upgradeTriggerType: (state) => state.newTask.upgradeTriggerType,
      newTaskDataAll: (state) => state.newTask.newTaskData,
      instantUpdateTime: (state) => state.app.instantUpdateTime
    }),
    newTaskData(){
      return this.newTaskDataAll[this.upgradeTriggerType];
    },
    taskUpdateObjText () {
      return this.$store.getters.getDictCodeObj('taskUpdateDictCode')
    },
    taskTypeObj () {
      return this.$store.getters.getTaskDictCodeObj('taskType')
    },
    slienceUpgradeTypeObj () {
      return this.$store.getters.getTaskDictCodeObj('slienceUpgradeType')
    },
    forceUpgradeTypeObj () {
      return this.$store.getters.getTaskDictCodeObj('forceUpgradeType')
    },
    factoryChannelObj () {
      return this.$store.getters.getDictCodeObj('factoryChannelDictCode')
    }
  },
  props: {
    taskId: {
      type: String,
      default: ''
    },
    channel: {
      type: Number,
      default: 0
    },
    upgradeTriggerType: {
      type: String,
      default: ''
    }
  },
  data () {
    return {
      TaskUtil,
      taskInfor: {
        taskGcyExt: {}
      },
      verifyDetailVisible: false,
      AuditGreyItems: [],
      infoStaticData: {},
      compName: 'LookupVerifyDetail',
      auditProcessQuery: {
        // 任务id
        businessKey: '',
        instanceId: '',
        businessCode: 'task_audit'
      }
    }
  },
  watch: {
    // 切换任务名称时重新请求数据
    instantUpdateTime: {
      handler () {

        console.log('haha')
        if (this.taskId) {
          // 获取任务详情
          this.getTaskInfor()
          this.getStatic()
        } else {
          // 新建任务时查看详情
          this.taskInfor = this.$commonFun.deepCopy(this.newTaskData)
        }
      },
      immediate: true
    }
  },
  mounted () {
    // 任务状态获取
    if (this.taskId) {
      this.$store.dispatch('getTaskUpdateDictCodeData')
      this.$store.dispatch('getFactoryChannelDictCodeData')
      this.$store.dispatch('getGcyOtaSupplierVerifyResultDictCodeData')
      this.$store.dispatch('getGcyOtaUpdateScopeDictCodeData')
    }
  },
  methods: {

    getTaskInfor () {
      const vm = this
      vm.$api.getTaskInfor({ id: vm.taskId }).then((res) => {
        vm.taskInfor = res.data
        if (res.data.instanceId) {
          vm.auditProcessQuery.instanceId = res.data.instanceId
        }
      })
    },
    // 车辆统计
    getStatic () {
      if (!this.taskId) {
        return
      }
      this.loadingInfoData = true
      this.$api
        .getUpgradeStatisticsReport({ taskIds: [this.taskId] })
        .then((res) => {
          if (!res.data) {
            return
          }
          const data = this.setUndefinedVal(res.data)
          this.infoStaticData = {
            totalVehicle: data.totalVehicle,
            successVehicle: data.successVehicle,
            notStartVehicle: data.notStartVehicle,
            notCompleteVehicle: data.notCompleteVehicle,
            failVehicle: data.failVehicle,
            runningVehicle: data.runningVehicle,
            pausedVehicle: data.pausedVehicle
          }
        })
        .finally(() => {
          this.loadingInfoData = false
        })
    },
    setUndefinedVal (data) {
      Object.keys(initInfoData).forEach((key) => {
        if (typeof data[key] === 'undefined') {
          // eslint-disable-next-line no-param-reassign
          data[key] = '-'
        }
      })
      return data
    },
    // 展示策略弹框
    showCelue () {
      this.$refs.showStrategy.visible = true
    },
    // 查看审核详情弹框
    openVerifyDetailModel (key) {
      this.verifyDetailVisible = true
      this.compName = key
      this.AuditGreyItems = []
      this['get' + key]()
    },
    // 获取审核详情
    getLookupVerifyDetail () {
      const vm = this
      vm.$api.getVerifyInfoDetail({ relId: vm.taskId, relType: 'FOTA_NORMAL_TASK' }).then((res) => {
        if (res.data && res.data.items) {
          this.AuditGreyItems = res.data.items
        }
      })
    },
    // 获取灰度详情getTaskgrayPush
    getViewGreyRelease () {
      const vm = this
      vm.$api.getTaskgrayPush({ id: vm.taskId }).then((res) => {
        if (res.data) {
          this.AuditGreyItems = res.data
        }
      })
    },
    // 取消
    handelCancel (record) {
      const vm = this
      this.$confirm({
        title: vm.$t('systemTip'),
        content: vm.$t('newCancelTaskTip').replace('__TaskName__', record.name),
        onOk () {
          vm.$api.cancelTask({ ids: [record.id] }, 'uat').then(() => {
            vm.$message.success(vm.$t('successfullyOperation'))
            vm.getTaskInfor()
          })
        },
        onCancel () {}
      })
    },
    // 取消并删包
    handelCancelAndDeletePackage (record) {
      const vm = this
      this.$confirm({
        title: vm.$t('systemTip'),
        content: vm.$t('newCancelTaskTip').replace('__TaskName__', record.name),
        onOk () {
          vm.$api.cancelAndDeletePackage({ ids: [record.id] }, 'uat').then(() => {
            vm.$message.success(vm.$t('successfullyOperation'))
            vm.getTaskInfor()
          })
        },
        onCancel () {}
      })
    },
    // 挂起或者进行中
    handleStopStart (record, enabled) {
      const vm = this
      this.$confirm({
        title: vm.$t('systemTip'),
        // eslint-disable-next-line max-len
        content: enabled ? vm.$t('continueTaskTip').replace('__TaskName__', record.name) : vm.$t('pauseTaskTip').replace('__TaskName__', record.name),
        onOk () {
          vm.$api.stopOrStart({ ids: [record.id], enabled: enabled }, 'uat').then(() => {
            vm.$message.success(vm.$t('successfullyOperation'))
            vm.getTaskInfor()
          })
        },
        onCancel () {}
      })
    },
    // 催办
    presstodo (record) {
      const vm = this
      vm.$api.processTodo({ ids: [record.id] }).then(() => {
        vm.$message.success(vm.$t('successfullyOperation'))
        vm.getTaskInfor()
      })
    },
    handleClickDropdownMenu (obj) {
      if (this[obj.type]) {
        this[obj.type](obj.record, obj.other)
      }
    },
    // 查看审核过程
    viewyAuditProcess () {
      this.auditProcessQuery.businessKey = this.taskId
      this.$refs.auditProcessDialogRef.toggleVisible(true)
    },
  }

}
</script>
<style lang="less" scoped>
.taskBaseInfo {
  margin-top: 20px;
  .static {
    color: @blockHoverTextColor;
  }
}
</style>
